<template>
    <div>
        <div v-for="i in product" :key="i.id" class="div01">
            <p>
                <img :src="base_url+i.goods_img" alt="" width="350px">
            </p> 
            <p>
                {{i.goods_name}}
            </p> 
            <p>
            <label for="" v-if="admin">{{i.admin_price}}</label>
            <label for="" v-else>{{i.goods_price}}</label>
            </p>
            <button @click="jump(i.id)">立即预定</button>
        </div>
        <div>
            <p></p>
        </div>
        <div>
            <p></p>
        </div>
    </div>
</template>

<script>
import axios from 'axios'
export default {
    data() {
        return {
            product:[],
            base_url:'http://127.0.0.1:8000/',
             admin : sessionStorage.getItem('admin')
        }
    },
    methods: {
        get(){
            
            axios(this.base_url+'product/').then(res=>{
                console.log(res.data)
                this.product = res.data
            })
        },
        jump(sid){
            let admin = sessionStorage.getItem('admin')
            if(admin){
                this.$router.push({path:'/add_order',query:{'sid':sid,'user_id':this.$route.query.user_id}})
            }else{
                this.$router.push('/login')
            }
        }
    },
    created() {
        this.get()
    }
}
</script>

<style scoped>
.div01{
    float: left;
    margin: 5px auto;
    margin-left: 15px;
}
</style>
